<script setup>
import {useRouter} from 'vue-router'
import {reactive,getCurrentInstance} from 'vue'
import loginApi from '@/api/loginApi'
import md5 from 'js-md5'
import microapp from '@micro-zoe/micro-app'

const {proxy} = getCurrentInstance()
const loginForm = reactive({
   account: '19999999999',
   password: '123456'
})
const router = useRouter()
function onSubmit() {
   let params = loginForm
   params.password = md5(params.password)
   loginApi.accountLogin(params).then(res => {
      console.log(res)
      const {success,data,message} = res
      if(success){
         let { accessToken } = data
         proxy.$message.success('登录成功！');
         microapp.setGlobalData({
            token: accessToken
         })
         router.push('/main/childHome')
      }else{
         proxy.$message.error(message);
      }
   })
}
</script>

<template>
   <div class="login-page"> 
      <span class="logo" @click="router.push('/main/childHome')">DOSS直聘</span>
   
      <div class="login-panel">
         <div class="panel-l">
            <ul>
               <li>找工作，上DOSS直聘直接谈</li>
               <li>沟通，在线职位及时沟通</li>
               <li>人性选，各大行业职位任你选</li>
            </ul>
            <div class="img-card">
               <img src="@/assets/img/trial_banner.png">
            </div>
         </div>
         <div class="panel-r">
            <h2>DOSS直聘 | 新一代数字化招聘平台</h2>
            <el-form :model="loginForm" size="large" >
               <el-form-item label="用户名" prop="account">
                  <el-input v-model="loginForm.account" placeholder="请输入用户名" clearable></el-input>
               </el-form-item>
               <el-form-item label="密码" prop="password">
                  <el-input type="password" v-model="loginForm.password" placeholder="请输入用密码" clearable></el-input>
               </el-form-item>
               <el-form-item>
                  <el-button type="primary" class="login-btn" @click="onSubmit('loginForm')">登 录</el-button>
               </el-form-item>
            </el-form>
         </div>
      </div>
   </div>
</template>

<style scoped>

</style>